import QtQuick 1.0

Rectangle {
    id:root
    width: 360
    height: 60
    color: "transparent"
    property alias title : titleId.text
    property alias subTitle : subTitleId.text
    property alias icon : iconLeft.source
    property alias fileSize : sizeId.text
    property int animOrientation : 0
    property bool active : false

    signal clicked()
    signal pressAndHold()

    function startAnim()
    {
        if (animOrientation != -1)
        anim.start()
    }



        SequentialAnimation {
            id:anim
            NumberAnimation {
                target: root
                property: "x"
                easing.type: Easing.InQuint
                duration: 200
                from :  0
                to:animOrientation ? -300 : 300
            }
            NumberAnimation {
                target: root
                property: "x"
                easing.type: Easing.InQuint
                duration: 200
                from :animOrientation ? -300 : 300
                to: 0
            }
        }



    Rectangle {
        visible: mouseArea.pressed || active ? true : false
        anchors.fill: parent
        color: "#F0A512"    }

    Text {
        id:titleId
        x: 80
        y: 6
        width: root.width - 120
        text: "title"
        anchors.verticalCenterOffset: -8
        font.family: "UbuntuBeta"
        anchors.left: parent.left
        anchors.leftMargin: 60
        anchors.verticalCenter: parent.verticalCenter
        color: "lightgray"
        font.bold:true
        elide: Text.ElideRight
        font.pixelSize: 16

        Text {
            id:subTitleId
            width: root.width - 80
            text: "sub content"
            font.family: "UbuntuBeta"
            anchors.top: parent.bottom
            color:  "#F0A512"
            font.pixelSize: 12
            elide: Text.ElideRight

        }
    }


    Rectangle {
        id:separator
        color: "lightgray"
        width: 360
        height: 1
        opacity: 0.5
    }

    Image {
        id: iconLeft
        y: 27
        width: 48
        height: 48
        anchors.left: parent.left
        anchors.leftMargin: 10
        anchors.verticalCenter: parent.verticalCenter


        NumberAnimation on scale{from: 0; to :1; duration: 700; easing.type:Easing.OutElastic}

        onStatusChanged: {
            if (status ==Image.Error )
                source="../extensions/empty.png"

        }


    }




    Text {
        id: sizeId
        x: 0
        y: 31
        width: 48
        height: 48
        anchors.right: parent.right
        anchors.rightMargin: 10
        anchors.verticalCenter: parent.verticalCenter
        text:""
        font.family: "UbuntuBeta"
        anchors.top: parent.bottom
        color:  "lightgray"
        font.pixelSize: 14
        verticalAlignment: Text.AlignVCenter


    }

    MouseArea {
        id:mouseArea
        anchors.fill: parent
        onClicked: {
            root.clicked()

        }
        onPressAndHold: {
            root.pressAndHold()

        }

    }

}
